<template>
    <div >
        <logo :a-is-collapse="showRef"></logo>    
        <button @click="toggle">toggle </button>
        <logo :a-is-collapse="showRef2" 
        :a-collapse-width="50"
        :a-expand-width="200"
        :a-transition-duration-ms="1000"></logo>
    </div>
</template>
<script setup lang='ts'>
import { ref } from 'vue';
import logo from './logo2.vue';
    const showRef=ref(true);
    const toggle=()=>{
        showRef.value=!showRef.value;
        //widthRef.value=widthRef.value/2;
        showRef2.value=!showRef2.value;
    }
    const showRef2=ref(false);


    
</script>
<style lang='less' scoped>
    
</style>